import React from "react";
import Filter from ".";
import comp from 'components'
import { ReactComponent as Plus } from 'assets/icons/plus.svg'

const { Select, Option, Button, Icon } = comp; //todo:很奇怪，直接解构引入就不行，必须先赋值给一个对象
const { Filters, Action } = Filter;


const FilterStory = {
    title: "UI组件/Filter",
    component: Filter
}

export default FilterStory;

export const Default = () => {
    return (
        <Filter>
            {<Filters label="列表排序">
                <Select>
                    <Option>最新消息优先</Option>
                    <Option>在线好友优先</Option>
                </Select>
            </Filters>}
            <Action label="创建会话">
                <Button>
                    <Icon icon={Plus} width={12} height={12} />
                </Button>
            </Action>
        </Filter>
    );
}

